<!--
 * @Description: 资源管理---运维资源---数据库
 * @Author: 魏勇
 * @Date: 2020-03-09 15:36:26
 * @LastEditTime: 2020-03-31 18:16:32
 * @LastEditors: 魏勇
 -->
<template>
    <div class="dbBase db_table_ctl" style="background-color: #fff;">
        <el-row>
            <span :key="btnItem.id" v-for="(btnItem,index) in btns" style="margin-left: 8px;">
                  <el-button v-if="btnItem.type==='iconBtn'" @click="btnClick(btnItem)" :icon="btnItem.icon"></el-button>
                    <el-button v-else @click="btnClick(btnItem)"
                               :icon="btnItem.icon">
                        {{btnItem.label}}
                    </el-button>

            </span>
            <el-button style="margin-left: 8px;" :key="index" v-for="(btnItem,index) in extendBtns"
                       @click="btnClick(btnItem)"
                       :icon="btnItem.icon">
                {{btnItem.label}}
            </el-button>

        </el-row>

        <!--        表格-->
        <el-row  style="padding-top: 8px;">
            <el-table-ctl  :fixOperation="true"  :dynamic="true"  :params="queryParams" :maxHeight="maxHeight" @operationClick="operationClick" :operations="operations" ref="tableObj" :cols="gridCols"></el-table-ctl>
        </el-row>

        <!--        新增窗口-->
        <app-dialog
                :isShowDialog="isShowAddDialog||isShowPurchaseWin"
                :title="winTitle"
                :width="winWidth"
                @confirm="addConfirm"
                @close="closeAddWin">
            <dynamicForm ref="dynamicForm" :items="formCols"></dynamicForm>
        </app-dialog>



        <!--        购买记录-->
        <app-dialog class="purchase_dialog"
                    :isShowDialog="isShowPurchaseRecordsWin"
                    title="购买记录"
                    :width="winSchemaWidth"
                    @confirm="addConfirm"
                    @close="isShowPurchaseRecordsWin=false">
            <purchase-records :tabType="tabType" :formCols="formCols"></purchase-records>
        </app-dialog>

        <!--        schema管理-->
        <app-dialog class="schema_dialog"
                :isShowDialog="showSchemaWinFlag"
                title="Schema管理"
                :width="winSchemaWidth"
                @confirm="addConfirm"
                @close="showSchemaWinFlag=false">
           <schema-mg :curType="tabType" :curResourceId="curResourceId" :curResourceName="curResourceName" @closeWin="closeWin"></schema-mg>
        </app-dialog>
    </div>
</template>

<script>
    import crudMixin from '@/mixins/crudMixin.js';
    import devResourceMixin from '../mixn/devResourceMixin';
    import enumData from "../data/enum";
    import AppDialog from "@/components/AppCommon/AppDialog";
    import dynamicForm from "@/views/devOpsResource/components/dynamicForm";
    import elTableCtl from "../components/el-table-ctl";
    import purchaseRecords from "../components/purchaseRecords";
    import schemaMg from './components/schemaMg';



    export default {
        name: "dbBase",
        mixins: [crudMixin,devResourceMixin],
        components: {
            AppDialog,
            dynamicForm,
            elTableCtl,
            purchaseRecords,
            schemaMg,
        },
        computed: {
            queryParams() {
                return {type: enumData.dbBase};
            }
        },
        data() {
            return {
                curResourceId:"",
                curResourceName:"",
                operations:[
                    {label:"Schema管理"}
                ],
                showSchemaWinFlag:false,
                tabType: enumData.dbBase,
                winSchemaWidth: (parseFloat(1300)/parseFloat(document.body.clientWidth))*100+"%",
            }
        },
        mounted() {
            //查询数据
            this.searchGridByCondition("");
        },
        watch: {},
        methods: {
            //关闭schema操作窗口
            closeWin(){
                this.showSchemaWinFlag=false;
            },
            //操作栏 按钮点击事件
            operationClick({row}){
                let {id,resourceName}=row;
                this.curResourceId=id;
                this.curResourceName=resourceName;
                this.showSchemaWinFlag=true;
            }
        }
    };
</script>
<style>

</style>
